<template>
	<view class="flex-center qrPage">
		<image :src="`${BASE_URL}${QRImg}` " mode="widthFix"></image>
		<view class="submitBtn flex" @click="onSave">保存收款码</view>
	</view>
</template>

<script>
	import {
		moneyQrCode
	} from "../../api/index.js"
	export default {
		data() {
			return {
				QRImg: '',
				BASE_URL: getApp().globalData.BASE_URL,
			}
		},
		onLoad(opt) {
			this.getCode(opt.bid)
		},
		methods: {
			async getCode(id) {
				const res = await moneyQrCode(`s=/ApiBusiness/collectioncode&bid=${id}`)
				const {
					status,
					data,
					msg
				} = res.data

				if (status == 1) {
					this.QRImg = data.code
					// console.log(res, "res----",data.code)
				} else {
					this.showToast(msg)
				}

			},
			onSave() {
				//  #ifdef APP-PLUS | MP-WEIXIN
				uni.showLoading({
					title: '保存中...'
				});
				uni.downloadFile({
					url: `${this.BASE_URL}${this.QRImg}`,
					success: (res) => {
						if (res.statusCode === 200) {
							uni.saveImageToPhotosAlbum({
								filePath: res.tempFilePath,
								success: () => {
									uni.hideLoading()
									uni.showToast({
										title: '保存成功~',
										icon: 'none'
									})
									// console.log('save success');
								},
								fail(err) {
									uni.hideLoading()
									uni.showToast({
										title: err,
										icon: 'none'
									})
									// console.log(err);
								}
							});
						}
					}
				});
				// #endif
				// #ifdef H5 
				var oA = document.createElement("a");
				oA.download = '收款码'; // 设置下载的文件名，默认是'下载'
				oA.href = `${this.BASE_URL}${this.QRImg}`;
				document.body.appendChild(oA);
				oA.click();
				oA.remove(); // 下载之后把创建的元素删除
				// #endif
			},
			saveImg() {
				var oA = document.createElement("a");
				oA.download = ''; // 设置下载的文件名，默认是'下载'
				oA.href = `${this.BASE_URL}${this.QRImg}`;
				document.body.appendChild(oA);
				oA.click();
				oA.remove(); // 下载之后把创建的元素删除
			},

		}
	}
</script>

<style lang="scss" scoped>
	.submitBtn {
		margin-top: 10vh;
		color: #fff;
		font-size: 34rpx;
		background: #41644A;
		border-radius: 14rpx;
		padding: 20rpx 0;
		justify-content: center;
		width: 40vw;
	}

	.qrPage {
		flex-direction: column;
	}

	.hint {
		color: #999;
		font-size: 24rpx;
		margin-bottom: 250rpx;
	}

	image {
		width: 100%;
	}

	.button {}
</style>